<template>
  <div class="container" id="que-bank-management">
    <table-filter>
      <el-input
        placeholder="请输入题库名称"
        clearable
        @clear="search"
        v-model="apiSetting.data.queBankName"
        class="input-with-select"
      >
      </el-input>
      <el-button plain type="warning" @click="search">查询</el-button>
    </table-filter>
    <el-row>
      <el-col :span="6">
        <el-button plain type="primary" @click="showEaDialog = true"
          >添加题库</el-button
        >
      </el-col>
    </el-row>
    <data-table
      ref="dtb"
      :api-setting="apiSetting"
      pagination
      :sort-column="sortColumn"
    >
      <!--<el-table-column fixed prop="quebankid" label="ID" width="80" sortable />-->
      <el-table-column
        prop="quebankname"
        label="题库名称"
        width="300"
        show-overflow-tooltip
      />
      <el-table-column
        prop="description"
        label="描述"
        width="760"
        show-overflow-tooltip
      />
      <el-table-column prop="subcou" label="包含科目" width="90" />
      <el-table-column prop="createperson" label="创建人" width="160" />
      <el-table-column
        prop="createtime"
        label="更新时间"
        width="180"
        show-overflow-tooltip
      >
        <template slot-scope="{ row }">
          {{ row.createtime | formatterDate }}
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作">
        <template slot-scope="{ row }">
          <el-button
            @click="hasEaPermission(row.createperson, 'edit', row)"
            type="text"
            size="small"
            >编辑
          </el-button>
          <el-button
            @click="hasEaPermission(row.createperson, 'del', row)"
            type="text"
            size="small"
            class="danger"
            >删除
          </el-button>
        </template>
      </el-table-column>
    </data-table>
    <ea-que-bank
      ref="eaDialog"
      @on-reload="dtb.loadData()"
      :show.sync="showEaDialog"
    ></ea-que-bank>
  </div>
</template>

<script>
import dtb from "@/mixins/refs/dtb";
import eaDialog from "@/mixins/refs/eaDialog";
import EaQueBank from "./EaQueBank";
import deleteRow from "@/mixins/dataTable/deleteRow";
import permission from "@/mixins/permission/permission";
import tbSearch from "@/mixins/dataTable/tbSearch";

export default {
  name: "index",
  components: { EaQueBank },
  mixins: [tbSearch, permission, deleteRow, dtb, eaDialog],
  data() {
    return {
      apiSetting: {
        method: "post",
        url: "/sys/queBank/getQuestionBankList",
        data: {
          queBankName: ""
        }
      },
      dataStructure: {
        description: "",
        quebankid: 0,
        quebankname: "",
        subids: []
      },
      sortColumn: ["quebankid"]
    };
  },
  methods: {
    edit(row) {
      this.axios
        .get(`/sys/queBank/getQuestionBankDetail/${row.quebankid}`)
        .then(res => {
          this.showEaDialog = true;
          this.eaDialog.$data.type = "edit";
          this.$nextTick(() => {
            this.eaDialog.$data.singleData = res;
          });
        });
    },
    del(row) {
      this.delRow(
        `/sys/queBank/deleteQuestionBankDetail/${row.quebankid}`,
        "题库"
      );
    }
  }
};
</script>

<style scoped></style>
